/*
* @Author: karry
* @Date:   2019-08-01 14:42:38
* @Last Modified by:   karry
* @Last Modified time: 2019-08-01 14:42:38
*/
import React from 'react';
import { Link, NavLink} from 'react-router-dom';
import './index.scss';

class NavSide extends React.Component{
	constructor(props){
		super(props);
	}
	render(){
		return (
			<div className="navbar-default navbar-side" role="navigation">
	            <div className="sidebar-collapse">
	                <ul className="nav" id="main-menu">
	                	<li className="navbar-title">
	                        <NavLink to="/">
	                        	<span>功 能 菜 单 栏</span>
	                       	</NavLink>
	                    </li>
	                    <li>
	                        <NavLink exact activeClassName="active-menu" to="/">
	                        	<i className="fa fa-bar-chart-o"></i> 
	                        	<span>首页</span>
	                       	</NavLink>
	                    </li>
	                    <li>
	                        <Link to="/product">
	                        	<i className="fa fa-shopping-cart"></i> 
	                        	<span>商品</span>
	                        	<span className="fa arrow"></span>
	                        </Link>
	                        <ul className="nav nav-second-level collapse">
	                            <li>
	                                <NavLink to="/product" activeClassName="active-menu">商品管理</NavLink>
	                            </li>
	                            <li>
	                                <NavLink to="/product-category" activeClassName="active-menu">品类管理</NavLink>
	                            </li>
	                        </ul>
	                    </li>
	                    <li>
	                        <Link to="/order">
	                        	<i className="fa fa-list-alt"></i> 
	                        	<span>订单</span>
	                        	<span className="fa arrow"></span>
	                        </Link>
	                        <ul className="nav nav-second-level collapse">
	                            <li>
	                                <NavLink to="/order" activeClassName="active-menu">订单管理</NavLink>
	                            </li>
	                        </ul>
	                    </li>
	                    <li>
	                        <Link to="/user">
	                        	<i className="fa fa-users"></i> 
	                        	<span>用户</span>
	                        	<span className="fa arrow"></span>
	                        </Link>
	                        <ul className="nav nav-second-level collapse">
	                            <li>
	                                <NavLink to="/user" activeClassName="active-menu">用户管理</NavLink>
	                            </li>
	                        </ul>
	                    </li>
	                </ul>
	            </div>
	        </div>
		);
	}
}

export default NavSide;